<template>
  <div class="wrapper">
    <img class="cart-img" :src="imgSrc" style="float: left" />
    <div class="des">
      <div class="top-content">{{ title }}</div>
      <div class="bottom-content">{{ content }}</div>
    </div>
  </div>
</template>

<script>
export default {
  name: "HelloWorld",
  props: {
    title: {
      type: String,
      default: "",
    },
    content: {
      default: "",
    },
    imgSrc: {
      type: String,
      default: "",
    },
  },
};
</script>

<style lang="scss" scoped>
.wrapper {
  width: 355px;
  height: 76px;
  background: #ffffff;
  border-radius: 8px;
  .des {
    display: flex;
    flex-direction: column;
    float: left;
    padding-left: 20px;
    .top-content {
      font-size: 14px;
      font-weight: 500;
      color: #333333;
    }
    .bottom-content {
      font-size: 12px;
      font-weight: 400;
      color: #666666;
    }
  }
}
</style>
